<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/layui/css/layui.css"media="all">
</head>
<body>


<form class="layui-form" action="">



  <div class="layui-form-item">
    <div class="layui-row">
    <div class="layui-col-md2">
        <select name="sid" lay-verify="required" id='server' class="layui-inline">
        <% let is_first=true;%>
        <% for(let k in ret.server ) {%>
            <% if(is_first){%>
            <option value="<%=ret.server[k].sid%>" selected><%=ret.server[k].sname%></option>
            <% is_first=false;%>
            <%}else{%>
            <option value="<%=ret.server[k].sid%>" ><%=ret.server[k].sname%></option>
            <%}%>
        <%}%>
        </select>
    </div>

   <div class="layui-col-md2">
    <input type="text" name="uid"  placeholder="UID" autocomplete="off" class="layui-input">
    </div>

   <div class="layui-col-md4">
       <input name="time" type="text" class="layui-input" placeholder="时间选择" id="test1">
  </div>

    <div class="layui-col-md2">
     <button class="layui-btn" lay-submit lay-filter="roleOK">立即提交</button>
    </div>


  </div>
  </div>





<table id="incomeT" lay-filter="incomeT"></table>


<!-- <button class="layui-btn">刷新</button> -->

<blockquote class="layui-elem-quote layui-quote-nm"></blockquote>



<script src="/layui/layui.js"></script>
<script>
    layui.config({
        base: '/webui/'  // 模块目录
    }).extend({
        "cosjs":"{/}/layui/?name=cosjs",
    }).use(['form','cosjs','table','laydate'], function () {
        let form = layui.form,cosjs=layui.cosjs,$ = layui.jquery;
        let table=layui.table;
        let laydate=layui.laydate;
         // let _ret=<%-JSON.stringify(ret)%>;
          


          //执行一个laydate实例
        laydate.render({
          elem: '#test1' //指定元素
          ,type: 'datetime'
          ,range: true //或 range: '~' 来自定义分割字符
        });

      function queryPage(_data){
      //向服务器查询
      let index=window.location.pathname.indexOf('/dataDigOnline');
      let head=window.location.pathname.slice(0,index);
      let  url =`${head}/dataDigOnline/query`;



      cosjs.post(url,_data.field).then(ret=>{
        let _oo={};
        let _rows=[];
        for(let k in ret.ret){
    
            if(k=='playerNum'){
                continue;
            }
            let p=k;
            let isOpen=false;
            if(k.indexOf('open')!=-1){
               p=k.slice(4,k.length);
               isOpen=true;
            }
            if(!_oo[p]){
                _oo[p]={};
                _oo[p].page=p;
            }
            if(isOpen){
              _oo[p].open=ret.ret[k];
            }else{
              _oo[p].time=ret.ret[k];
            }
         }

        let timeTotal=0;
        let openTotal=0;

        for(let k in _oo){
            let _row={};
            _row.page=k;
            _row.time=_oo[k].time;
            timeTotal+=_oo[k].time;
            _row.open=_oo[k].open;
            openTotal+=_oo[k].open;
            _rows.push(_row);
        }

        let timeTotalAvg=0;
        let openTotalAvg=0;

        for(let j of _rows){
          j.timeRate=((j.time/timeTotal)*100).toFixed(0)+'%';
          j.openRate=((j.open/openTotal)*100).toFixed(0)+'%';

          j.openAvg=(j.open/ret.ret.playerNum).toFixed(2)
          j.timeAvg=(j.time/ret.ret.playerNum).toFixed(2)
          timeTotalAvg+=j.open/ret.ret.playerNum;
          openTotalAvg+=j.time/ret.ret.playerNum;
        }

     

        for(let j of _rows){

          j.timeRateAvg=((j.timeAvg/timeTotalAvg)*100).toFixed(0)+'%';
          j.openRateAvg=((j.openAvg/openTotalAvg)*100).toFixed(0)+'%';
        }








         _rows.sort((a,b)=>{return b.open*100+b.time-a.open*100-a.time})
        //table.data=_coll;

        table.render({
        elem: '#incomeT'
        ,height: 960
        ,limit:_rows.length
        // ,url: '/demo/table/user/' //数据接口
        ,page: false //开启分页
        ,cols: [[ //表头
          {field: 'page', title: '界面', width:200}
          ,{field: 'open', title: '次数', width:100}
          ,{field: 'openRate', title: '占比', width:100}
          ,{field: 'openAvg', title: '人均次数', width:100}         
          ,{field: 'time', title: '时间', width:100}
          ,{field: 'timeRate', title: '占比', width:100}
          ,{field: 'timeAvg', title: '人均时间', width:100}


          // ,{field: 'openRateAvg', title: '占比', width:100}
        
          // ,{field: 'timeRateAvg', title: '占比', width:100}


        ]],
        data:_rows,
      });

      });
    }



    form.on('submit(roleOK)', function(data){ 
      queryPage(data);
      return false;
    })


    });
</script>
</body>
</html>